.app{
    max-width: 750px;
    background: #f6f6f6;
    padding-bottom: 0.44rem;
}

.top{
   width: 100%;
   height: 3.3rem;
   position: relative;
   left: 0;
   top: 0;
   box-sizing: border-box;
   border-bottom: 0.01rem solid #f6f6f6;
   padding: 0.6rem 0 0 0.32rem;
   background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #F6F6F6 94%), linear-gradient(270deg, #12B0DB 0%, #9795FF 100%);
}
.priImg{
    width: 2.6rem;
    height: 2.6rem;
    position: absolute;
    z-index: 3;
    right:0;
    top: 0.4rem;
}
.top .priceBox{
  display: flex;
  align-items: center;
  position: relative;
  margin-left: 0.24rem;
}
.top .priceBox img{
    width: 1rem;
    height: 1rem;
    position: absolute;
    left: -0.24rem;
    top: -0.08rem;
}
.top .priceBox p{
    font-size: 0.6rem;
    font-weight: bold;
    color: #12B0DB;
    border-radius: 0 0.4rem 0.4rem 0;
    background: rgba(255, 255, 255, 0.7);
    box-sizing: border-box;
    border: 1px solid #FFFFFF;
    height: 0.8rem;
    line-height: 0.75rem;
    padding: 0 0.4rem 0 1rem;
}

.signBox{
    width: 6.86rem;
    border-radius: 0.16rem;
    opacity: 1;
    margin: -1.3rem auto 0.44rem;
    background: linear-gradient(0deg, #FFFFFF 0%, #D5F2FF 100%);
    box-sizing: border-box;
    border: 0.02rem solid #FFFFFF;
    padding: 0.32rem 0.24rem;
    position: relative;
    z-index: 2;
}
.signBox .p1{
    color: #12B0DB;
    font-size: 0.32rem;
}
.signBox .p2{
    color: #999999;
    font-size: 0.21rem;
    margin-top: 0.13rem;
}
.signBox .signWeek{
    margin-top: 0.4rem;
}
.signBox .signWeek .fontFolor1{
    color: #12B0DB;
    font-size: 0.21rem;
    margin-top: 0.18rem;
}
.signBox .signWeek .fontFolor2{
    color: #5E5E5E;
    font-size: 0.21rem;
    margin-top: 0.18rem;
}

.signBox .signWeek .signItem1{
  text-align: center;
}
.signBox .signWeek .signItem1 .signItemTop{
    width: 0.8rem;
    height: 0.8rem;
    line-height: 0.8rem;
    text-align: center;
    border-radius: 0.16rem;
    background: linear-gradient(180deg, rgba(18, 176, 219, 0.45) 0%, rgba(151, 149, 255, 0.64) 100%);
}
.signBox .signWeek .signItem1 img{
    width: 0.38rem;
    height: 0.28rem;
}

.signBox .signWeek .signItem2{
    text-align: center;
}
.signBox .signWeek .signItem2 .signItemTop{
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 0.16rem;
    background: #F3F3F3;
    display:flex;
    align-items: center;
    justify-content: center;
}
.signBox .signWeek .signItem2 .signItemTop .go{
    font-size: 0.21rem;
    font-weight: bold;
    color: #D8D8D8;
    width: 0.4rem;
    border-radius: 50%;
    height: 0.4rem;
    line-height: 0.4rem;
    text-align: center;
    border: 0.02rem dashed #D8D8D8;
}

.signBox .signWeek .signItem3{
    text-align: center;
}
.signBox .signWeek .signItem3 .signItemTop{
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 0.16rem;
    background: #fff;
    display:flex;
    align-items: center;
    justify-content: center;
}
.signBox .signWeek .signItem3 .signItemTop .addPrice{
    background: linear-gradient(140deg, #FFF3A7 16%, #FFC641 87%);
    box-shadow: 0.01rem 0.02rem 0.04rem 0px rgba(151, 170, 182, 0.5);
    border-image: linear-gradient(316deg, #FFEAB7 15%, #FDD77C 86%) ;
    border: 0.04rem solid #FDD77C;
    color: #EA9C00;
    border-radius: 50%;
    font-size: 0.21rem;
    font-weight: bold;
    width: 0.48rem;
    height: 0.48rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.signBox .signBtn{
    width: 6.38rem;
    height: 0.64rem;
    line-height: 0.64rem;
    border-radius: 0.6rem;
    text-align: center;
    font-size: 0.32rem;
    font-weight: bold;
    color: #fff;
    margin-top:0.42rem;
    background: linear-gradient(270deg, #12B0DB 0%, #9795FF 100%);
}
.signBox .active{
    background: linear-gradient(0deg, #CDCDCD 0%, #E4E2E2 100%);
    cursor: auto;
}
.tasks{
   width: 6.86rem;
   margin: 0 auto 0.5rem;
   border-radius: 0.16rem;
   background: #D5F2FF;
    box-sizing: border-box;
    padding:0 0.05rem 0.1rem;
}
.tasks .tasksBj{
  height: 0.54rem;
  line-height: 0.54rem;
  width: 3rem;
  position: relative;
  margin: 0 auto;
  text-align: center;
  top: -0.18rem;
}
.tasks .tasksBj img{
    width: 100%;
    height: 100%;
}
.tasks .tasksBj p{
    width: 3rem;
    text-align: center;
    position: absolute;
    top: 0;
    font-size: 0.26rem;
    font-weight: bold;
    color: #fff
}
.tasks .list{
    width: 6.7rem;
    border-radius: 0.12rem;
    background: #FFFFFF;
    margin: 0.23rem auto 0;
    padding: 0.32rem 0.4rem;
    box-sizing: border-box;
}
.tasks .list .listItem{
    margin-top: 0.3rem;
}
.tasks .list .listItem:first-child{
    margin-top: 0;
}
.tasks .list .listItem .left .p1{
    color: #5E5E5E;
    font-size: 0.32rem;
    margin-right: 0.2rem;
}
.tasks .list .listItem .left .p2{
    color: #EA9C00;
    font-size: 0.24rem;
}
.tasks .list .listItem .right{
    width: 1.32rem;
    height: 0.52rem;
    line-height: 0.52rem;
    text-align: center;
    border-radius: 0.24rem;
    color: #FFFFFF;
    font-size: 0.28rem;
}
.btnColor1{
    background: linear-gradient(0deg, #CDCDCD 0%, #E4E2E2 100%);
}
.btnColor2{
    background: linear-gradient(180deg, #60DDFF 0%, #12B0DB 100%);
}
.btnColor3{
    background: linear-gradient(270deg, #32BEFF 0%, #9795FF 100%);
}